<template>
	<view class="position-relative">
		<view class="position-absolute">
			<image src="../../static/img/ic_home_mine_top_bg.png" style="width: 750rpx;height: 336.5rpx;" mode="">
			</image>
		</view>
		<view class="position-absolute" style="top: 110rpx;width: 750rpx;">
			<view class="flex justify-between mb-1" style="padding-left: 66rpx;padding-right: 74rpx;">
				<view class="flex">
					<image :src="userInfo.head_pic" @click="uploadImg" style="width: 134rpx;height: 134rpx;"
						v-if="userInfo.head_pic" class="rounded-circle" mode=""></image>
					<image @click="uploadImg" src="../../static/img/ic_default_head.png"
						style="width: 134rpx;height: 134rpx;" class="rounded-circle" v-else mode=""></image>
					<view class="flex-column ml-3">
						<view class="colorfff font34 mb-4">{{ userInfo.user_name }}</view>
						<navigator url="integral/integral">
							<view class="colorfff font24 line-h">积分：{{ userInfo.jifen }}</view>
						</navigator>
					</view>
				</view>
				<view class="flex yiqiandao font22 font-weight-500 justify-center align-center"
					v-if="!userInfo.is_signing">已签到</view>
				<view class="flex qiandao font22 font-weight-500 justify-center align-center" v-else @click="qiandao">
					签到领积分</view>
			</view>
			<view class="position-relative" style="left: 48rpx;height:212rpx;">
				<image src="../../static/img/ic_home_mine_grfw.png" class="position-absolute"
					style="width: 660rpx;height: 212rpx;" mode=""></image>
				<view class="flex align-center justify-center position-absolute px-3"
					style="height: 212rpx; width: 606rpx;" v-if="type=='1'">
					暂无个人服务
				</view>
				<view class="flex align-center position-absolute px-3" style="height: 212rpx; width: 606rpx;"
					v-if="type=='2'">
					<!-- #ifdef H5 -->
					<view class="text-center" style="width:200rpx;">
						<navigator url="../recharge/recharge">
							<image src="../../static/img/ic_home_mine_cz.png" class="mb-1"
								style="width: 40rpx;height: 40rpx;" mode=""></image>
							<view class="line-h color666 font26 font-weight-normal">充值</view>
						</navigator>
					</view>
					<!-- #endif -->
					<navigator url="../Whitelist/Whitelist">
						<view class="text-center" style="width:200rpx;">
							<image src="../../static/img/ic_home_mine_thbmd.png" class="mb-1"
								style="width: 40rpx;height: 40rpx;" mode=""></image>
							<view class="line-h color666">亲情号</view>
						</view>
					</navigator>
					<navigator url="../device/device">
						<view class="text-center" style="width:200rpx;">
							<image src="../../static/img/ic_home_mine_sbdl.png" class="mb-1"
								style="width: 40rpx;height: 40rpx;" mode=""></image>
							<view class="line-h color666">设备绑定</view>
						</view>
					</navigator>
				</view>
			</view>
			<view class="px-25 mt-5">
				<view class="flex  align-center">
					<image src="../../static/img/ic_service_my.png" style="width: 28rpx;height: 28rpx;" mode=""></image>
					<view class="flex align-center font30 font-weight-500 ml-3"
						style="color: #323234;margin-top: -15rpx;">
						我的服务
						<image src="../../static/img/ic_home_wdfw.png" style="width: 12rpx;height: 14rpx;" class="ml-1"
							mode=""></image>
					</view>
				</view>
				<view class="flex flex-wrap">
					<view class="flex-column text-center" style="width:175rpx;margin-top: 43rpx;" @click="feedback">
						<image src="../../static/img/ic_home_mine_fkyj.png" style="width: 40rpx;height: 40rpx;" mode="">
						</image>
						<view class="color666 font26">反馈意见</view>
					</view>
					<navigator url="deviceunbinding/deviceunbinding">
						<view class="flex-column text-center" style="width:175rpx;margin-top: 43rpx;" v-if="type=='2'">
							<image src="../../static/img/ic_home_mine_sbdl.png" style="width: 40rpx;height: 40rpx;"
								mode=""></image>
							<view class="color666 font26">设备解绑</view>
						</view>
					</navigator>
					<view class="flex-column text-center" style="width:175rpx;margin-top: 43rpx;" @click="aboutUs">
						<image src="../../static/img/ic_home_mine_gywm.png" style="width: 40rpx;height: 40rpx;" mode="">
						</image>
						<view class="color666 font26">关于我们</view>
					</view>
					<view class="flex-column text-center" style="width:175rpx;margin-top: 43rpx;" @click="equipment"
						v-if="type=='2'">
						<image src="/static/img/ic_home_mine_sbxx.png" style="width: 40rpx;height: 40rpx;" mode="">
						</image>
						<view class="color666 font26">设备信息</view>
					</view>
					<navigator url="positioningswitch/positioningswitch">
						<view class="flex-column text-center" style="width:175rpx;margin-top: 43rpx;" v-if="type=='2'">
							<image src="../../static/img/dwkg.png" style="width: 40rpx;height: 40rpx;" mode=""></image>
							<view class="color666 font26">定位开关</view>
						</view>
					</navigator>
					<!-- <view class="flex-column text-center" style="width:175rpx;margin-top: 43rpx;" @click="inquire">
						<image src="/static/img/ic_diaocha.png" style="width: 40rpx;height: 40rpx;" mode=""></image>
						<view class="color666 font26">问卷调查</view>
					</view> -->
					<navigator url="../changepass/changepass">
						<view class="flex-column text-center" style="width:175rpx;margin-top: 43rpx;">
							<image src="../../static/img/ic_home_mine_xgmm.png" style="width: 40rpx;height: 40rpx;"
								mode=""></image>
							<view class="color666 font26">修改密码</view>
						</view>
					</navigator>
					<navigator url="../login/login">
						<view class="flex-column text-center" style="width:175rpx;margin-top: 43rpx;" @click="loginout">
							<image src="../../static/img/ic_home_mine_qhsf.png" style="width: 40rpx;height: 40rpx;"
								mode=""></image>
							<view class="color666 font26">切换身份</view>
						</view>
					</navigator>
					<navigator url="help/help">
						<view class="flex-column text-center" style="width:175rpx;margin-top: 43rpx;">
							<image src="../../static/img/ic_home_mine_bz.png" style="width: 40rpx;height: 40rpx;"
								mode=""></image>
							<view class="color666 font26">帮助</view>
						</view>
					</navigator>
					<navigator url="../login/login">
						<view class="flex-column text-center" style="width:175rpx;margin-top: 43rpx;" @click="loginout">
							<image src="../../static/img/ic_home_mine_tcdl.png" style="width: 40rpx;height: 40rpx;"
								mode=""></image>
							<view class="color666 font26">退出登录</view>
						</view>
					</navigator>
					<!-- #ifdef H5 -->
					<!-- <navigator url="../download/download">
						<view class="flex-column text-center" style="width:175rpx;margin-top: 43rpx;" @click="loginout">
							<image src="../../static/img/ic_login_password.png" style="width: 40rpx;height: 40rpx;" mode=""></image>
							<view class="color666 font26">APP下载</view>
						</view>
					</navigator> -->
					<!-- #endif -->
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapMutations,
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				headImg: '',
				qiandaoType: false,
				userInfo: {},
				type: null,
			};
		},
		onShow() {
			this.type = uni.getStorageSync('intType');

			if (this.type == '1') {
				this.userInfo=uni.getStorageSync('userInfo')
			} else {
				this.getUserInfo();
			}

		},
		methods: {
			getteacherInfo() {
				let _this = this;
				let opts = {
					url: 'Login.shtml'
				};
				let param = {
					intType: 1,
					phone_number: uni.getStorageSync('HCmobile'),
					password: uni.getStorageSync('HCpassword'),
					openid: uni.getStorageSync('openId'),
					regId: '1104a89792c0bbf2d8d'
				};
				_this.$http.httpRequest(opts, param).then(
					res => {
						console.log(res.data);
						_this.stopsubmit=false;
						if (res.data.code == '200') {
							_this.userInfo = res.data.data;
							_this.login(res.data.data);
						} else {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					},
					error => {
						_this.stopsubmit=false;
						console.log(error);
					}
				);
			},
			getUserInfo() {
				let _this = this;
				let opts = {
					url: 'UserInfo.shtml'
				};
				let param = {
					token: uni.getStorageSync('userInfo').token
				};
				_this.$http.httpRequest(opts, param).then(
					res => {
						console.log(res.data);
						if (res.data.code == '200') {
							_this.userInfo = res.data.data;
							_this.login(res.data.data);
						} else {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					},
					error => {
						console.log(error);
					}
				);
			},
			...mapMutations(['login']),
			uploadImg() {
				uni.chooseImage({
					success: chooseImageRes => {
						const tempFilePaths = chooseImageRes.tempFilePaths;
						uni.uploadFile({
							url: this.$http.baseUrl + '/FileUpload.shtml', //仅为示例，非真实的接口地址
							filePath: tempFilePaths[0],
							name: 'file',
							formData: {},
							success: uploadFileRes => {
								console.log(uploadFileRes);
								if (uploadFileRes.statusCode == 200) {
									let data = JSON.parse(uploadFileRes.data);
									console.log(data);
									this.changeAvator(data.filePath, data.url);
								}
							}
						});
					}
				});
			},
			changeAvator(path, url) {
				let this_ = this;
				let opts={};
				if (this_.type == '2') {
					opts = {
						url: 'Jz/SaveJz.shtml'
					}
				} else {
					opts = {
						url: 'Ls/SaveLs.shtml'
					}
				}
				let param = {
					headImg: path,
					token: uni.getStorageSync('userInfo').token
				};
				this_.$http.httpTokenRequest(opts, param).then(
					res => {
						console.log(res.data);
						if (res.data.code == '200') {
							if (this_.type == '2') {
								this_.getUserInfo();
							} else {
								this_.getteacherInfo();
							}
						} else {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					},
					error => {
						console.log(error);
					}
				);
			},
			loginout() {
				this.logout();
			},
			...mapMutations(['logout']),
			qiandao() {
				let this_ = this;
				let opts = {
					url: 'jifen/Sign.shtml'
				};
				let param = {
					token: uni.getStorageSync('userInfo').token
				};
				this_.$http.httpRequest(opts, param).then(
					res => {
						console.log(res.data);
						if (res.data.code == '200') {
							this_.getUserInfo();
							this_.qiandaoType = true;
						} else {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					},
					error => {
						console.log(error);
					}
				);
			},
			aboutUs() {
				uni.navigateTo({
					url: 'aboutUs/aboutUs'
				})
			},
			equipment() {
				uni.navigateTo({
					url: 'equipment/equipment'
				})
			},
			feedback() {
				uni.navigateTo({
					url: 'feedback/feedback'
				})
			},
			// inquire() {
			// 	uni.navigateTo({
			// 		url: 'inquire/inquire'
			// 	})
			// },
		}
	};
</script>

<style>
	.qiandao {
		width: 150.1rpx;
		height: 50.3rpx;
		border-radius: 30rpx;
		background-color: #e55353;
		color: rgba(255, 255, 255, 0.7);
	}

	.yiqiandao {
		width: 150.1rpx;
		height: 50.3rpx;
		border-radius: 30rpx;
		background-color: #999999;
		color: rgba(255, 255, 255, 0.7);
	}
</style>
